Page({



  /**
   * 页面的初始数据
   */
  data: {
    width: 0,
    height: 0,
    rainCount: 100,
    rain: {
      x: -1,
      y: -1,
      length: -1,    // 长度
      angle: 90,     // 倾斜角度
      width: -1,     // 宽度
      height: -1,    // 高度
      speed: 1,      // 速度
      offset_x: 0,   // 横轴移动偏移量
      offset_y: 0,   // 纵轴移动偏移量
      alpha: 1,      // 透明度
      color1: "",    // 红包的色彩
      color2: "",    // 红包的色彩
    },
    rains: [],
    rainCount: 30,
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this
    //获取系统信息  
    wx.getSystemInfo({
      //获取系统信息成功，将系统窗口的宽高赋给页面的宽高  
      success: function (res) {
        that.width = res.windowWidth
        // console.log(that.width)   375
        that.height = res.windowHeight
        // console.log(that.height)  625
        // 这里的单位是PX，实际的手机屏幕有一个Dpr，这里选择iphone，默认Dpr是2
      }
    })


  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    console.info(this.width);
    console.info(this.height);
    // this.drawRedPakege();
    // this.playRains();

    // var context = wx.createCanvasContext('redPakege');
    // context.translate(0, 0);
    // context.drawImage("../../images/ic_home_1_checked.png", 100, 100, 40, 40);
    // context.draw();

    // for (var i = 0; i < 10; i++) {
    //   this.init(this.data.rain);
    //   this.data.rains.push(this.data.rain);
    // }

    // console.info("length: --- > " + this.data.rains.length);
    this.initData();
  },


  /****************初始化函数********************/
  init: function (obj) { //初始化
    console.info("init");
    this.getPos(obj);
    obj.alpha = 1;//透明度
    //最小长度，最大长度
    var x = Math.random() * 80 + 150;
    obj.length = Math.ceil(x);
    obj.angle = Math.random() * 50 + 75; //红包倾斜角
    x = Math.random() + .4;
    obj.speed = x; //红包的速度
    var cos = Math.cos(obj.angle * 3.14 / 180);
    var sin = Math.sin(obj.angle * 3.14 / 180) * 5;
    obj.width = obj.length * cos;  //红包所占宽度
    obj.height = obj.length * sin;//红包所占高度
    obj.offset_x = obj.speed * cos;
    obj.offset_y = obj.speed * sin;
  },

  /*****************获取随机坐标的函数*****************/
  getPos: function (obj) {
    //横坐标200--1200
    console.info(this.width);
    console.info(this.height);
    obj.x = Math.random() * this.width;   // 窗口宽度
    //纵坐标小于600
    obj.y = Math.random() * this.height;  // 窗口高度

    console.info("obj.x:" + obj.x);
    console.info('obj.y:' + obj.y);
  },

  /***************重新计算红包坐标的函数******************/
  countPos: function (obj) {
    //往左下移动,x减少，y增加
    obj.x = obj.x - obj.offset_x;
    obj.y = obj.y + obj.offset_y;
  },

  /**************绘制红包*****************/
  draw: function (obj) { //绘制一个红包的函数
    var context = wx.createCanvasContext('redPakege', this);
    console.info("x:" + obj.x + " +  width: " + obj.width + " = " + (obj.x + obj.width));
    console.info("y:" + obj.y + " -  height: " + obj.height + " = " + (obj.y - obj.height));
    context.drawImage("../../images/ic_home_1_checked.png", obj.x + obj.width, obj.y - obj.height, 59, 77);
    context.draw();
  },

  /**************红包移动*****************/
  move: function (obj) {
    //清空红包像素
    var x = obj.x + obj.width - obj.offset_x;
    var y = obj.y - obj.height;
    //重新计算位置，往左下移动
    this.countPos(obj);
    //透明度增加
    obj.alpha -= 0.002;
    //重绘
    this.draw(obj);
  },



  playRains: function () {
    for (var n = 0; n < this.data.rainCount; n++) {
      this.move(this.data.rains[n]);//移动
      if (this.data.rains[n].y > this.height * 3) {//超出界限后重来
        this.init(this.data.rains[n]);
      }
    }
    if (this.canvasShow == true) {
      var redBagTimer = setTimeout(function () {
        this.playRains()
      }, 2);
    } else {
      // $("#stars").fadeOut(0);
      clearTimeout(redBagTimer)
    }
  },


  initData: function() {
    //画红包
    for (var i = 0; i < this.data.rainCount; i++) {
      this.init(this.data.rain);
      this.draw(this.data.rain);
      this.data.rains.push(this.data.rain);
    }
    this.playRains();//绘制红包
  }

})